<template>
  <div>
    <div class="breadcrumb">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item :to="{ path: '/main' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>管理员管理</el-breadcrumb-item>
        <el-breadcrumb-item>图书馆管理员日志</el-breadcrumb-item>
      </el-breadcrumb>
    </div>

    <el-card class="box-card">
         <el-row :gutter="20">
           <el-col :span="9">
              <el-input placeholder="请输入内容" v-model="queryInfo.query" clearable  @clear="getAdminList">
                  <el-button slot="append" icon="el-icon-search" @click="getAdminList"></el-button>
              </el-input>
           </el-col>
         </el-row>
     </el-card>
     <div class="table">
         <el-table :data="adminInfo" border stripe>
          <el-table-column type="id" label="编号"></el-table-column>
          <el-table-column type="name" label="姓名"></el-table-column>
          <el-table-column type="signTime" label="登陆时间"></el-table-column>
          <el-table-column type="signInTime" label="签到时间"></el-table-column>
          <el-table-column type="signNum" label="签到次数"></el-table-column>
        </el-table>
    </div>
  </div>

</template>

<script>
  export default {
      data() {
        return {
         adminInfo:[],
          queryInfo: {
            query: '',
            pageNum: 1,
            pageSize: 5
          },
        }
      },
      methods:{
        async getAdminList(){
          const {data: result} = await this.$http.get('/admin/list',{
             params: this.queryInfo
          })
          if(result.status !== 200) return this.$message.error("用户列表查询失败")
          this.adminInfo = result.data.rows
        },
     },
     created() {
       this.getAdminList()
     }
   }
</script>

<style>
  .breadcrumb{
    margin-bottom: 20px;
  }
  .operation{
    margin-bottom: 20px;
  }
  .table{
    white-space: nowrap;
  }
</style>
